<template>
  <el-carousel
    :interval="10000"
    indicator-position="none"
    style="width: 100%;height:100%;"
  >
    <el-carousel-item
      :key="0"
      class="main-content">
      <pxq/>
    </el-carousel-item>
    <el-carousel-item
      :key="1"
      class="main-content">
      <sf/>
    </el-carousel-item>

    <el-carousel-item
      :key="2"
      class="main-content">
      <chart/>
    </el-carousel-item>

  </el-carousel>
</template>

<script>
import pxq from '@/views/modules/content'
import sf from '@/views/pages/sf'
import chart from '@/views/modules/chart/chart'
export default {
  components: {
    pxq,
    sf,
    chart
  },
  data () {
    return {}
  },
  created () {},
  methods: {}
}
</script>

<style lang="less" scoped>
.main-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 980px;
}
.el-carousel__container {
  height: 980px !important;
}
#data-view {
  width: 100%;
  height: 100%;
  background-color: #030409;
  color: #fff;

  #dv-full-screen-container {
    background-image: url("../../img/bg.png");
    background-size: 100% 100%;
    box-shadow: 0 0 3px blue;
    display: flex;
    flex-direction: column;
  }
}
</style>
